<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Donvan</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="">
        <meta name="author" content="">
        <!-- Le styles -->
        <link href="/static/bootstrap/css/bootstrap.min.css" rel="stylesheet">
        <style type="text/css">
                    body {
                        padding-top: 60px;
                        padding-bottom: 40px;
                    }
        </style>
        <link href="/static/bootstrap/css/bootstrap-theme.min.css" rel="stylesheet">
{#        <link href="/static/bootstrap/css/bootstrap-responsive.css" rel="stylesheet">#}
        <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
        <!--[if lt IE 9]>
        <script src="/static/bootstrap/js/html5shiv.js"></script>
        <![endif]-->
        <!-- Fav and touch icons -->
        <link rel="shortcut icon" href="/static/ico/favicon.gif">
    </head>
    <body class="well well-sm" style="padding-top: 10px">

        <header>
          <div class="container well-sm">
              <h3><a href='/' class="text-muted">DONVAN'S BLOG</a></h3>
          <p class="text-right">Thinking is like loving and dying.</p>
          </div>
        </header>


        <div class="container-fluid">
            <div class="row">
                <div class="col-md-2">
                <small>
                    {% if isAdminUser %}
                    <h5 class="text-info" style="padding-left: 30px;">Hi donvan ^_^</h5>
                    {% endif %}
                    <div data-toggle="collapse" data-target="#admin">
                        <img src="/static/img/sleepy_guy.jpg" alt="my avatar" width="150px" class="img-rounded"/>
                    </div>
                    <div id="admin" class="collapse">
                        <hr />
                        {% if isAdminUser %}
                        <ul class="nav" style="padding-left: 50px; padding-right: 50px; margin-bottom: 0px">
                            <li><a href="/admin/">Admin</a></li>
                            <li><a href="/admin/logout">logout</a></li>
                        </ul>
                        {% else %}
                        <h6>Login</h6>
                        <form class="form-inline" method="post" id="login-form" action="/admin/">
                            {% csrf_token %}
                            <input class="input-medium" type="text" placeholder="username" id="id_username" name="username" style="height: 15px; margin: 2px">
                            <input class="input-medium" type="password" placeholder="password" id="id_password" name="password" style="height: 15px; margin: 2px">
                            <input type="hidden" name="this_is_the_login_form" value="1">
                            <input type="hidden" name="next" value="/admin/">
                            {#                                <label class="checkbox">#}
                                {#                                    <input type="checkbox">#}
                                {#                                    <small>Remember me</small>#}
                            {#                                </label>#}
                            <button type="submit" class="btn btn-sm">
                            Sign in
                            </button>
                        </form>
                        {% endif %}
                    </div>
                    <hr />
                    <h5>Search</h5>
                    <form class="form-search" onkeydown="if(event.keyCode==13){return false}">
                        <div class="input-append" >
                            <input id="appendedInputButton" type="text" style="width: 135px; height:24px; font-size:12px; padding: 0">
                            <button class="btn btn-sm" type="button" onclick="search()">
                            GO
                            </button>
                        </div>
                    </form>
                    <hr />
                    <h5>Category</h5>
                        {{ categories|safe }}
                    <hr />
                    <h5>Tags</h5>
                <ul>
                    {% for tag in tags %}
                    <li><a href="/tag/{{ tag.content }}"> {{tag.content}} </a>({{tag.post_count}}) </li>
                    {% endfor %}
                </ul>
                    <hr />
                    <h5>date category</h5>
                    <ul>
                        {% for date, count in archive %}
                        <li>
                            <a href='/date/{{ date|slice:"4" }}/{{ date|slice:"5:7" }}'> {{date}} </a>
                            ({{count}})
                        </li>
                        {% endfor %}
                    </ul>
                    <hr />
                    <h5>Links</h5>
                    <ul>
                        {% for link in links %}
                        <li>
                            <a href={{link.url}}>{{link.name}}</a>
                        </li>
                        {% endfor %}
                    </ul>
                </div>
            </small>
                <div class="col-md-10" style="padding-right: 30px">
                    {%block content%}content{%endblock%}
                </div>
            </div>
            <hr>
            <footer>
                <p style="text-align: center">
                &copy; donvan 2013
                </p>
            </footer>
        </div>
        <script src="/static/js/jquery.min.js"></script>
        <script src="/static/bootstrap/js/bootstrap.min.js"></script>
        <link rel="stylesheet" href="/static/css/highlight.default.min.css">
        <script src="/static/js/highlight.min.js"></script>
        <script>
            function search(){
                var search_content = $("input#appendedInputButton").val()
                location.href="/search/"+search_content
            }
            hljs.initHighlightingOnLoad();
        </script>
    </body>
</html>
